<template>
	<view>
		<myhead left="1" home="1"></myhead>
		<view class="tit">
			<view>向卖家付款</view>
			<view>￥{{list.sumAmount}}</view>
			<view>付款剩余时间<span>{{yzmBtnTxt1}}</span></view>
		</view>
		<view class="content">
			<view>购买USDT</view>
			<view>
				<view>卖家姓名</view>
				<view>{{list.sellNickName}}</view>
			</view>
			<view>
				<view>银行卡号</view>
				<view>{{list.bankNo}}</view>
			</view>
			<view>
				<view>开户银行</view>
				<view>{{list.bankName}}</view>
			</view>
		</view>
		<view class="btn" @tap="btn">我已付款成功</view>
	</view>
</template>

<script>
	const http = require('../../utils/http.js');
	export default {
		data() {
			return {
				list:'',
				yzmBtnTxt1:null,
				tradeId:null,
				userInfo:null
			}
		},
		onLoad(options) {
			if(options.tradeId){
				//console.log(options.tradeId)
				this.tradeId=options.tradeId
			}else{
				uni.showToast({
				  title: '非法操作',
				  icon: 'none',
				  duration:1000
				});
				uni.hideLoading();
				setTimeout(function () {
				    uni.switchTab({
				        url: '/pages/home/home'
				    });
				}, 1000);
			}
		},
		onShow() {
			uni.showLoading({
			    title: '加载中'
			});
			if(uni.getStorageSync('userInfo')){
				this.userInfo=uni.getStorageSync('userInfo')
			}else{
				this.userInfo=null
			}
			http.post('/api/purchase/getTradeDetail',{tradeId:this.tradeId}).then(res => {
				clearInterval(this.clock1); //清除js定时器
				uni.showToast({
				  title: res.message,
				  icon: 'none',
				  duration:1000
				});
				if (res.code == 200 && res.result) {
					this.list=res.result
					this.yzmBtnTxt1 = this.list.leftPaySeconds+'秒';
					this.clock1 = setInterval(this.doLoop1, 1000); //一秒执行一次
				}
				uni.hideLoading();
			})
		},
		methods: {
			btn:function(){
				if(this.list.status !=0){
					uni.showToast({
					  title: '该订单已付款或卖家已确认收款--请去我的订单进行查看',
					  icon: 'none'
					});
					// uni.showModal({
					//     title: '提示',
					//     content: '该订单已付款或卖家已确认收款--请去我的订单进行查看',
					//     success: function (res) {
					//         if (res.confirm) {
					//             console.log('用户点击确定');
					// 			uni.navigateTo({
					// 			    url: '/pages/user/myOrder'
					// 			});
					//         } else if (res.cancel) {
					//             console.log('用户点击取消');
					//         }
					//     }
					// });
					return false
				}
				let that=this
				uni.showModal({
				    title: '付款确认',
				    content: '请确认您已向卖家付款--恶意点击将直接冻结账户',
				    success: function (res) {
				        if (res.confirm) {
				            console.log('用户点击确定');
							http.post('/api/purchase/comfirmPayment',{tradeId:that.tradeId}).then(res => {
								uni.showToast({
								  title: res.message,
								  icon: 'none',
								  duration:1000
								});
								if (res.code == 200) {
									uni.navigateTo({
										url:'/pages/order/orderDetails?tradeId='+that.tradeId+'&buyerAccountId='+that.list.buyerAccountId
									})
								}
							})
				        } else if (res.cancel) {
				            console.log('用户点击取消');
				        }
				    }
				});
			},
			doLoop1:function(){
				if(this.list.leftPaySeconds > 0){
					this.list.leftPaySeconds -= 1;
					this.yzmBtnTxt1 = this.list.leftPaySeconds+'秒';
				}else{
					clearInterval(this.clock1); //清除js定时器
					this.yzmBtnTxt1 = '订单已取消';
				}
			}
		}
	}
</script>

<style>
	.tit{
		padding: 4vw;
		color: #999999;
		font-size: 3.8vw;
		display: flex;
		flex-direction: column;
		align-items: center;
		border-bottom: 1px solid #F2F2F2;
	}
	.tit>view:nth-child(2){
		font-size: 8vw;
		font-weight: bold;
		color: #333333;
	}
	.tit>view:nth-child(3) span{
		color: #007AFF;
		margin-left: 1vw;
	}
	.content{
		padding: 4vw;
		font-size: 3.8vw;
	}
	.content>view{
		padding: 2vw 0;
		display: flex;
		flex-direction: row;
		justify-content: space-between;
	}
	.btn{
		width: 84%;
		padding: 4vw 0;
		font-size: 3.5vw;
		border-radius: 1.8vw;
		background-image: linear-gradient(45deg, #24EBA9, #10C7B2);
		color: #FFFFFF;
		text-align: center;
		margin: 0 auto;
		margin-top: 10vw;
	}
</style>
